import { Handlers, PageProps } from "$fresh/server.ts";
import { Package } from "$classes/package.ts";
import { ExtractPackageFileCodeProps, FileCode, PackageFileCodeProps } from "@components/package/files/Code.tsx";
import { ExtractFolderProps, PackageFolderBrowser, PackageFolderProps } from "@components/package/files/Folder.tsx";

export const handler: Handlers<PackageFilePageProps, Viapak.Package.State> = {
  async GET(req, ctx) {
    const { pathname } = new URL(req.url);
    const { _package } = ctx.state;

    const file = await ExtractPackageFileCodeProps(pathname, _package);
    const folder = ExtractFolderProps(pathname, _package);

    return ctx.render({ file, folder, package: ctx.state._package })
  }
}

interface PackageFilePageProps {
  file?: PackageFileCodeProps['file'] | null
  folder?: PackageFolderProps['folder'] | null
  package: Package
}

export default function PackageFilePage({ data: { file, folder, package: _package }}: PageProps<PackageFilePageProps>) {
  return (
    <div class="mt-12 flex">
      { file &&
        <FileCode file={file} package={_package} />
      }
      { folder &&
        <PackageFolderBrowser folder={folder} package={_package} />
      }
    </div>
  )
}